const ConsumerList = (props) => {

    const {consumers} = props;

    return (
        <div style={{marginTop: '15px'}}>
            {consumers && consumers.map((consumer, index) => (
                <div
                    key={index}
                    style={{
                        width: '400px',
                        border: '1px solid #C0C0C0',
                        marginBottom: '10px',
                        padding: '10px',
                        borderRadius: '10px'
                    }}
                >
                    <div style={{display: 'flex'}}>
                        <span style={{fontWeight: 'bold'}}>消费者服务名：</span>
                        <span>{consumer.consumerServiceName}</span>
                    </div>
                    <div style={{display: 'flex', marginTop: '10px'}}>
                        <span style={{fontWeight: 'bold'}}>服务在线实例ip：</span>
                        <span>{consumer.consumerServiceIp}</span>
                    </div>
                    <div style={{display: 'flex', marginTop: '10px'}}>
                        <span style={{fontWeight: 'bold'}}>当前订阅状态：</span>
                        <span>{consumer.subscribeStatus}</span>
                    </div>
                </div>
            ))}
        </div>
    )
}

export default ConsumerList;











